﻿@using System.Web.Optimization
@using VocaDb.Model.Domain.Images
@using VocaDb.Model.Helpers
@using VocaDb.Web.Models.SongLists;
@using VocaDb.Web.Helpers;
@using Res = ViewRes.SongList.EditStrings;
@using EditRes = ViewRes.EntryEditStrings
@inherits VocaDb.Web.Code.VocaDbPage<SongListEditViewModel>
@{
	
	var isNew = (Model.Id == 0);
	string parentUrl;
	
	if (!isNew) {
		PageProperties.Title = string.Format(Res.EditTitle, Model.CurrentName);
		parentUrl = Url.Action("Details", new { id = Model.Id });
		ViewBag.Parents = new[] { 
			Html.ActionLink(Model.CurrentName, "Details", new { id = Model.Id }) 
		};
	} else {
		PageProperties.Title = Res.CreateTitle;	
		parentUrl = Url.Action("Featured");
	}
	
	var thumbUrl = Url.EntryImageOld(Model.Thumb, ImageSize.SmallThumb);
	
}

@section Toolbar {
	@if (!isNew) {
		if (!Model.Deleted) {
			<a href="#" id="deleteLink" data-bind="click: function() { deleteViewModel.dialogVisible(true); }">@ViewRes.SharedStrings.Delete</a>
		}
		<a href="#" id="trashLink" data-bind="click: trashViewModel.show">@EditRes.MoveToTrash</a>
	}
}

@section BodyScripts {
@Scripts.Render("~/bundles/shared/edit", "~/bundles/SongList/Edit")
<script type="text/javascript">

	$(document).ready(function () {
		var urlMapper = new vdb.UrlMapper('@RootPath');
		var repoFactory = new vdb.repositories.RepositoryFactory(urlMapper, @LanguagePreferenceInt);
		initPage(repoFactory, @Model.Id);
	});

</script>
}

@Helpers.ValidationSymmaryPanel(Res.UnableToSave)

<form action="@Url.Action("Edit", "SongList")" id="songListForm" method="POST" enctype="multipart/form-data" data-bind="submit: submit, visible: true" style="display: none;">
	@Html.HiddenFor(m => m.CanCreateFeaturedLists)

	@Helpers.SaveAndBackBtn(parentUrl)

	<div id="tabs">

		<ul>
			<li><a href="#propertiesTab">@Res.TabProperties</a></li>
			<li><a href="#songsTab">@Res.TabSongs</a></li>
		</ul>

		<div id="propertiesTab">

			<div class="editor-label">
				@Res.Name
			</div>
			<div class="editor-field">
				<input type="text" data-bind="value: name" class="required input-xxlarge" size="200" required />
			</div>

			<div class="editor-label">
				@Res.Description
				@Helpers.MarkdownNotice()
			</div>
			<div class="editor-field">
				<textarea data-bind="textInput: description" rows="6" cols="60" maxlength="3000" class="input-xxlarge"></textarea>
				
				<div>
					@ViewRes.EntryEditStrings.LivePreview
					<div data-bind="markdown: description"></div>
				</div>
			</div>

			@if (Model.CanCreateFeaturedLists) {
				<div class="editor-label">
					@Res.FeaturedCategory
				</div>
				<div class="editor-field">
					@Html.EnumDropDownListForDic(m => m.FeaturedCategory, Translate.SongListFeaturedCategoryNames, new Dictionary<string, object> { { "data-bind", "value:featuredCategory" } })
				</div>
			}
			
			<div class="editor-label">
				@Helpers.HelpLabel(Res.EventDate, Res.EventDateHelp)
			</div>
			<div class="editor-field">
				<input type="text" data-bind="datepicker: { value: eventDateDate, dateFormat: 'yy-mm-dd' }" class="span2" maxlength="10" />
			</div>

			<div class="editor-label">
				@Res.Thumbnail
			</div>
			<div class="editor-field">
				<div class="media">
					@if (!string.IsNullOrEmpty(thumbUrl)) {
						<img class="pull-left media-object" src="@thumbUrl" alt="Thumb" />
					}
					<div class="media-body">
						@Helpers.ImageUploadMessage()
						<input type="file" id="thumbPicUpload" name="thumbPicUpload" />
					</div>
				</div>
			</div>
			
			<div class="editor-label">
				@Helpers.HelpLabel(Res.Status, Resources.CommonMessages.EntryStatusExplanation)
			</div>
			<div class="editor-field">
				@Html.DropdownForKnockout(m => m.Status, ViewHelper.CreateEnumList(Model.AllowedEntryStatuses, Translate.EntryStatusNames.GetTranslatedFields(Model.AllowedEntryStatuses)), "value: status")
			</div>

		</div>

		<div id="songsTab">

			<table>
				<tbody data-bind="sortable: songLinks">
				<tr class="ui-state-default">
					<td style="cursor: move">
						<span class="ui-icon ui-icon-arrowthick-2-n-s"></span>
					</td>
					<td>
						<span data-bind="text: order"></span>
					</td>
					<td>
						<span data-bind="title: song.additionalNames, text: song.name"></span>
						<br />
						<span class="extraInfo" data-bind="text: song.artistString"></span>
					</td>
					<td>
						<input type="text" data-bind="value: notes" maxlength="200" />
					</td>
					<td>
						<a href="#" class="iconLink removeLink" title="@Res.RemoveFromList" data-bind="click: $parent.removeSong">@ViewRes.SharedStrings.Remove</a>
					</td>
				</tr>
				</tbody>
			</table>

			<br />

			<h4>@Res.AddSong</h4>
			<input type="text" data-bind="songAutoComplete: songSearchParams" maxlength="128" placeholder="@ViewRes.SharedStrings.Search" class="input-xlarge" />

		</div>

	</div>
	
	<br />	
	<p>@ViewRes.EntryEditStrings.UpdateNotes</p>
	<textarea data-bind="value: updateNotes" class="input-xxlarge" rows="4" maxlength="200"></textarea>

	<input type="hidden" name="model" data-bind="value: ko.toJSON($root)" />
	<br />
	@Helpers.SaveAndBackBtn(parentUrl)

</form>

@EntryDetailsHelpers.EntryDeletePopup(ViewRes.EntryEditStrings.ConfirmDelete)
@EntryDetailsHelpers.EntryTrashPopup(EditRes.ConfirmMoveToTrash)
